{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="{% static 'bingxingtu/css/progresscircle.css' %}">
    <style type="text/css">
        .circlechart {
            float: left;
            padding: 20px;
            width: 90px;
        }

        .search_input {
            width: 100%;
            height: 42px;
            padding-left: 13px;
        }

        .search_button {
            height: 42px;
            /*width:42px;*/
            cursor: pointer;
            position: absolute;
        }

        .bar input {
            border: 3px solid #1f309f;
            border-radius: 5px;
            background: transparent;
            top: 0;
            right: 0;
        }

        .bar button {
            background-color: #1f3e54;;
            /*background: linear-gradient(to right, #be0063, #ffcbd4);*/
            border-radius: 0 5px 5px 0;
            width: 160px;
            top: 0;
            right: 0;
            color: white;
        }

        .bar button:before {
            font-size: 13px;
            color: #a7eded;
        }

        button {
            border: none;
            outline: none;
        }


    </style>


    <script type="text/javascript/" src="{% static 'bootstrap-3.3.7-dist/js/bootstrap.js' %}"></script>

    {#    背景颜色#}
    {#    <style>#}
    {#        body{#}
    {#            background: url("{% static  'bj.jpg' %}");#}
    {#            background-attachment: fixed;#}
    {#            background-size: cover;#}
    {#        }#}
    {#    </style>#}
    <style>


    </style>

</head>
<body>
{#<h2 style="margin-left: 400px;color: #3378cc;font-weight: bold">欢迎使用 接口测试平台</h2>#}

{# 搜索框#}
<div class="search bar" style="position: absolute;top: 10px; left: 490px;width: -webkit-calc(100% - 980px)">
    <div id="search_button">
        <strong>
            <input class="search_input" id="search_input" placeholder="输入搜索关键词，可以是项目名、接口名" name="keys" type="text"
                   value="{{ keys }}">
        </strong>
        <button class="search_button" id="search_submit" onclick="search()" style="width: 100px"><strong><font size="5">搜
            索</font></strong></button>
    </div>

</div>


<script>
    function search() {
        //获取输入内容
        key = document.getElementById('search_input').value;
        // 清空搜索结果
        document.getElementById('search_result').innerHTML = '';
        // 判断是否继续进行
        if(key == '' || key == ' '){
            return
        }
        // 发送请求给后台
        $.get('/search/',{
            'key':key
        },function (ret) {
            // 把结果显示
            document.getElementById('search_close').style.display='block';
            var d = document.getElementById('search_result');
            d.style.display = 'block';
            results = ret.results; //ret.results是返回结果为列表
            for(var i=0;i<results.length;i++){
                var a =document.createElement('a');
                a.href = results[i].url;
                a.target = '__blank';
                a.innerText =  '【'+results[i].type+'】：'+results[i].text;

                d.appendChild(a);
                d.appendChild(document.createElement('br'));
                d.appendChild(document.createElement('br'));
            }
        })
    }

</script>

{# 搜索结果#}
<div id=search_result style="display: none;z-index: 999;position: absolute;top: 80px;left: 17%;width: 70%;min-height: 300px;
            background:linear-gradient(to bottom,#b8eafd,#e8ffdb) ;opacity:0.8;padding: 5px;
            border-radius: 2px;box-shadow: 4px 4px 8px #bcbcbc">
    {#    <strong>#}
    {#        <a href="">我是搜索结果1</a> <br>#}
    {#        <a href="">我是搜索结果2</a> <br>#}
    {##}
    {#    </strong>#}


</div>

<script>
    function search_close(){
        $("#search_result").hide();
        $("#search_close").hide();

    }

</script>


<button id="search_close" onclick="search_close()" style="display: none;z-index: 999;position: absolute;top: 80px;
right: 13%;height:25px;border-radius: 5px;background: black;color: white">close
</button>


{#    竖线#}
<div id="shu" style="position: absolute;width: 2px;left: 340px;top: 70px;background: #e0ddde">&nbsp;</div>

{# 项目显示#}
<div style="height: 400px;overflow-y: scroll;margin-left: 15px;width: 300px;" class="panel-group" id="accordion"
     role="tablist" aria-multiselectable="true">
    <h4>您的项目如下：</h4>
    {% for i in user_projects %}
        <div class="panel panel-default">
            <div class="panel-heading" role="tab" id="heading{{ i.id }}">
                <h4 class="panel-title">
                    <a class="collapsed" style="text-decoration: none" role="button" data-toggle="collapse"
                       data-parent="#accordion" href="#collapse{{ i.id }}" aria-expanded="false"
                       aria-controls="collapse{{ i.id }}">
                        <span style="color: #014bcb;font: bold 15px/15px 微软雅黑"> {{ i.name }} </span>
                    </a>
                </h4>
            </div>
            <div id="collapse{{ i.id }}" class="panel-collapse collapse" role="tabpanel"
                 aria-labelledby="heading{{ i.id }}">
                <div style="padding-left: 10px;font-size: xx-small">
                    备注：{{ i.remark }} <br>
                    其他管理员：{{ i.other_user }} <br>
                    <a href="/apis/{{ i.id }}/"
                       style="background-color: #47ba04;color: white;font-size: large;border-radius: 5px">&nbsp;立即进入&nbsp;</a>
                    &nbsp;
                    <a href="#" onclick="save_api('{{ i.id }}')"
                       style="background-color: #e92f6c;color: white;font-size: large;border-radius: 5px">&nbsp;保存请求&nbsp;</a>
                    <br>
                    <br>
                </div>
            </div>
        </div>
    {% endfor %}
</div>


<script>
        function save_api(id) {
        // 获取接口的所有数据
        var ts_method = document.getElementById('ts_method').value ;
        var ts_url = document.getElementById('ts_url').value ;
        var ts_host = document.getElementById('ts_host').value ;
        var ts_header = document.getElementById('ts_header').value ;
         // 判断顶部的数据是否填充完
        if(ts_method == 'none'){alert('请选择请求方式！');return}
        if(ts_url == ''){alert('请输入url！');return}
        if(ts_host == ''){alert('请输入host！');return}
         //判断关键数据是否符合规则
        if(ts_host.slice(0,7) != 'http://' && ts_host.slice(0,8) != 'https://'){
            alert('host必须以http://或https://开头！');return
        }
        if(ts_header != ''){
            try {
                JSON.parse(ts_header)
            }catch (e) {
                alert('header请求头不符合json规范！');
                return
            }
        }
        var ts_body_method = $('ul#myTab li[class="active"]')[0].innerText;
        if(ts_body_method == 'none'){
            var ts_api_body = ''
        }
        if(ts_body_method == 'form-data'){
            var ts_api_body = []; //新建这个空列表用来存放后续的数据
            var tbody_ = $("table#mytable tbody")[0]; //获取该表格的内容部分
            var trlist = tbody_.children ; //获取下面所有tr，每个tr就是一个键值对实际上
            for(var i=0;i<trlist.length;i++) {
                var tdarr = trlist[i].children; // 获取tr下的俩个td
                var key = tdarr[0].innerText; // 获取key
                var value = tdarr[1].innerText; // 获取value
                ts_api_body.push([key, value]);// 作为一个数组，存放到这个大数组里。
            }
            ts_api_body = JSON.stringify(ts_api_body);
        }
        if(ts_body_method == 'x-www-form-urlencoded'){
            var ts_api_body = []; //新建这个空列表用来存放后续的数据
            var tbody_ = $("table#mytable2 tbody")[0]; //获取该表格的内容部分
            var trlist = tbody_.children ; //获取下面所有tr，每个tr就是一个键值对实际上
            for(var i=0;i<trlist.length;i++) {
                var tdarr = trlist[i].children; // 获取tr下的俩个td
                var key = tdarr[0].innerText; // 获取key
                var value = tdarr[1].innerText; // 获取value
                ts_api_body.push([key, value]);// 作为一个数组，存放到这个大数组里。
            }
            ts_api_body = JSON.stringify(ts_api_body);
        }
        if(ts_body_method == 'Text'){
            var ts_api_body = document.getElementById('raw_Text').value;
        }
        if(ts_body_method == 'JavaScript'){
            var ts_api_body = document.getElementById('raw_JavaScript').value;
        }
        if(ts_body_method == 'Json'){
            var ts_api_body = document.getElementById('raw_Json').value;
        }
        if(ts_body_method == 'Html'){
            var ts_api_body = document.getElementById('raw_Html').value;
        }
        if(ts_body_method == 'Xml'){
            var ts_api_body = document.getElementById('raw_Xml').value;
        }

         // 发送请求给后台
         $.get('/Home_save_api/',{
            'project_id':id,
            'ts_method':ts_method,
            'ts_url':ts_url,
            'ts_host':ts_host,
            'ts_header':ts_header,
            'ts_body_method':ts_body_method,
            'ts_api_body':ts_api_body,
        },function (ret) {
            alert('保存成功！')
        })
    }





</script>

}
</script>


{#横线隔开请求记录#}
<div id="heng" style="width: 310px;height: 1px;background-color: #e0ddde;position: absolute;left:15px ;bottom: 410px">
    &nbsp;
</div>


{#左侧记录#}
<div id="home_log_plan" style="padding-left: 20px;overflow-y: scroll;width: 320px;position: absolute;bottom: 10px">
    <br>
    {% for i in home_log %}
        <div style="background-color: #eefaff;margin-bottom: 3px;border-radius: 5px;padding: 1px">
        <a href="/home_log/{{ i.id }}/" style=";text-decoration: none"  class="log" >
            <span style="font-size: large;;color: black">{{ i.api_method }}</span>
            {{ i.api_host }}{{ i.api_url }}
        </a>
        </div>
    {% endfor %}
</div>

<script>
    var h = document.documentElement.clientHeight;
    document.getElementById('shu').style.height = (h - 85).toString() + 'px';
    document.getElementById('home_log_plan').style.height = "400px";
</script>


{#右侧调试窗口#}

<div style="position: absolute;top: 100px;left: 380px;width: -webkit-calc(100% - 390px);">
    {# 调试弹层及函数 #}
           <ul class="nav navbar-nav" style="width: 98%">
            <li>
                <select id="ts_method" style="height: 40px;" class="form-control">
                    <option value="none"> 请求方式</option>
                    <option value="post" > POST</option>
                    <option value="get" > GET</option>
                    <option value="put" > PUT</option>
                    <option value="delete"> DELETE</option>
                </select>
            </li>

            <li style="width: -webkit-calc(100% - 225px)">
                <input id="ts_url" style="color: black;padding-left: 10px;width: 100%;height: 40px;" type="text" placeholder='url: 如 /abcd/efgh/' value="{{ log.api_url }}">
            </li>

            <li >
                <button onclick="ts_send()" type="button"
                        style="height: 40px;width: 120px;"
                        class="btn btn-default"><span style="font-size: large">Send</span></button>
            </li>
        </ul>
        <br><br><br>
        <ul class="nav navbar-nav" style="width: 98%">
            <li style=" width: -webkit-calc(100% - 63px)">

                <datalist id="datalist_1">
                    {% for i in hosts %}
                        <option id="host_{{ i.id }}" value="{{ i.host }}">{{ i.host }}</option>
                    {% endfor %}
                </datalist>
                 <input list="datalist_1" autocomplete="off"  id="ts_host"  style="color: black;padding-left: 10px;width: 100%;height: 40px;" type="text" placeholder='host: 如http(s)://xxxx.ccc.com' value="{{ log.api_host }}">
            </li>
             <li >
                <button type="button"
                        style="height: 40px;width: 60px;"
                        class="btn btn-default"><span>Clear</span></button>
            </li>
        </ul>
        <br><br><br>
        <ul class="nav navbar-nav" style="width: 98%">
            <li style="width:  -webkit-calc(100% - 63px)">
                 <input id="ts_header"  style="color: black;padding-left: 10px;width: 100%;height: 40px;" type="text"
                       placeholder='header请求头：如{"Content":"application/json"}' value="{{ log.api_header }}">
            </li>
             <li >
                <button type="button"
                        style="height: 40px;width: 60px;"
                        class="btn btn-default"><span>Clear</span></button>
            </li>
        </ul>
        <br><br><br>
        <ul id="myTab" class="nav nav-tabs" >
            <li class="active"><a id="click_none" href="#none" data-toggle="tab" >none</a></li>
            <li ><a href="#form-data" data-toggle="tab" >form-data</a></li>
            <li ><a href="#x-www-form-urlencoded" data-toggle="tab" >x-www-form-urlencoded</a></li>
            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">raw <b class="caret"></b></a>
                <ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop1">
                    <li><a href="#Text" tabindex="-1" data-toggle="tab">Text</a></li>
                    <li><a href="#JavaScript" tabindex="-1" data-toggle="tab">JavaScript</a></li>
                    <li><a href="#Json" tabindex="-1" data-toggle="tab">Json</a></li>
                    <li><a href="#Html" tabindex="-1" data-toggle="tab">Html</a></li>
                    <li><a href="#Xml" tabindex="-1" data-toggle="tab">Xml</a></li>
                </ul>
            </li>



            <li ><a href="#response" data-toggle="tab" >返回体</a></li>
        </ul>
        <div id="myTabContent" class="tab-content">
            <div class="tab-pane fade in active" id="none" style="text-align: center;color: grey">
                <h3>这个请求将不会携带任何请求体</h3>
                <h5>This request will not carry any request-body</h5>
            </div>
            <div class="tab-pane fade" id="form-data">
                <div class="table-responsive" style="width: 98%;color: black">
                    <table class="table table-bordered table-striped" id="mytable" style="background-color:white">
                        <thead style="color: #337ab7;font-size: x-small">
                          <tr>
                            <td style="width: 30%">Key</td>
                            <td style="width: 50%">Value</td>
                          </tr>
                        </thead>
                        <tbody id="mytbody">
                          <tr>
                            <td></td>
                            <td></td>
                          </tr>
                        </tbody>
                    </table>
                </div>
                <button class="btn btn-default" id="add"><i class="fa fa-plus"></i> 添加新参数</button>
                <script>window.jQuery || document.write('<script src="/static/201801271505/js/jquery-1.11.0.min.js"><\/script>')</script>
                <script type="text/javascript" src="/static/201801271505/js/bootstable.js"></script>
            </div>
            <div class="tab-pane fade" id="x-www-form-urlencoded">
                <div class="table-responsive" style="width: 98%;color: black">
                    <table class="table table-bordered table-striped" id="mytable2" style="background-color:white">
                        <thead style="color: #337ab7;font-size: x-small">
                          <tr>
                            <td style="width: 30%">Key</td>
                            <td style="width: 50%">Value</td>
                          </tr>
                        </thead>
                        <tbody id="mytbody2">
                          <tr>
                            <td></td>
                            <td></td>
                          </tr>
                        </tbody>
                    </table>
                </div>
                <button class="btn btn-default" id="add2"><i class="fa fa-plus"></i> 添加新参数</button>
                <script>window.jQuery || document.write('<script src="/static/201801271505/js/jquery-1.11.0.min.js"><\/script>')</script>
                <script type="text/javascript" src="/static/201801271505/js/bootstable.js"></script>
            </div>
            <div class="tab-pane fade" id="Text">
                <textarea name="" id="raw_Text" style="color: black;width: 98%;height: 300px"></textarea>
            </div>
            <div class="tab-pane fade" id="JavaScript">
                <textarea name="" id="raw_JavaScript" style="color: black;width: 98%;height: 300px"></textarea>
            </div>
            <div class="tab-pane fade" id="Json">
                <textarea name="" id="raw_Json" style="color: black;width: 98%;height: 300px"></textarea>
            </div>
            <div class="tab-pane fade" id="Html">
                <textarea name="" id="raw_Html" style="color: black;width: 98%;height: 300px"></textarea>
            </div>
            <div class="tab-pane fade" id="Xml">
                <textarea name="" id="raw_Xml" style="color: black;width: 98%;height: 300px"></textarea>
            </div>

            <div class="tab-pane fade" id="GraphQL">
                 <table style="width: 98%">
                   <thead>
                        <tr>
                            <td style="width: 55%"><span >QUERY</span></td>
                            <td style="width: 40%"><span >GRAPHQL VARIABLES</span></td>
                          </tr>
                   </thead>
                    <tbody>
                      <tr>
                        <td><textarea id="body_plan_G_Q"  rows="14" style="padding-left: 3px;border-radius: 5px;width: 99%"></textarea></td>
                        <td><textarea id="body_plan_G_G"  rows="14" style="padding-left: 3px;border-radius: 5px;width: 100%"></textarea></td>
                      </tr>
                    </tbody>
                </table>
            </div>

            <div class="tab-pane fade" id="response">
                <textarea name="" id="ts_response_body" disabled="disabled" style="background-color: #e4f3f5;color: black;width: 98%;height: 300px"></textarea>
            </div>
        </div>


<script>
    {#解决第三方插件显示问题#}
    $('#mytable').SetEditable({
        $addButton: $('#add'),
    });
    {#解决第三方插件显示问题#}
    $('#mytable2').SetEditable({
        $addButton: $('#add2'),
    });

    // 自动设置请求类型
    if ("{{ log.api_method }}" != '') {
        document.getElementById('ts_method').value = "{{ log.api_method }}";
    }
    //请求体类型 //请求体
    if ("{{ log.body_method }}" != '') {
        console.log("{{ log.body_method }}");
        console.log("{{ log.api_body }}");

        var body_method = '#' + "{{ log.body_method }}";
        $("li a[href=" + body_method + "]").click();

        if ("{{ log.body_method }}" == 'Text') {
            document.getElementById('raw_Text').value = "{{ log.api_body }}";
        }
        if ("{{ log.body_method }}" == 'JavaScript') {
            document.getElementById('raw_JavaScript').value = "{{ log.api_body }}";
        }
        if ("{{ log.body_method }}" == 'Json') {
            document.getElementById('raw_Json').value = "{{ log.api_body }}";
        }
        if ("{{ log.body_method }}" == 'Html') {
            document.getElementById('raw_Html').value = "{{ log.api_body }}";
        }
        if ("{{ log.body_method }}" == 'Xml') {
            document.getElementById('raw_Xml').value = "{{ log.api_body }}";
        }
        if ("{{ log.body_method }}" == 'form-data') {
            var tbody = document.getElementById('mytbody'); // 定位表格中的tbody部分

            body = eval("{{ log.api_body }}".replace(new RegExp('&quot;', "gm"), '"')); //把这个像列表的字符串请求体变成真正的列表
            for (var i = 0; i < body.length; i++) { // 遍历这个请求体列表
                key = body[i][0]; //拿出每一个键值对的key
                value = body[i][1];//拿出每一个键值对的value
                var childs_tr = tbody.children;//获取到这个表格下面所有的tr组成的大列表
                // 每个tr下的children得到的是 td列表，只有俩个。
                childs_tr[i].children[0].innerText = key; //第一个td放key
                childs_tr[i].children[1].innerText = value;//第二个td放value
                //判断是否是最后一次遍历，来决定是否点击新增参数按钮
                if (i < body.length - 1) {
                    document.getElementById('add').click()
                }
            }
        }
        if ("{{ log.body_method }}" == 'x-www-form-urlencoded') {
            var tbody = document.getElementById('mytbody2'); // 定位表格中的tbody部分

            body = eval("{{ log.api_body }}".replace(new RegExp('&quot;', "gm"), '"')); //把这个像列表的字符串请求体变成真正的列表
            for (var i = 0; i < body.length; i++) { // 遍历这个请求体列表
                key = body[i][0]; //拿出每一个键值对的key
                value = body[i][1];//拿出每一个键值对的value
                var childs_tr = tbody.children;//获取到这个表格下面所有的tr组成的大列表
                // 每个tr下的children得到的是 td列表，只有俩个。
                childs_tr[i].children[0].innerText = key; //第一个td放key
                childs_tr[i].children[1].innerText = value;//第二个td放value
                //判断是否是最后一次遍历，来决定是否点击新增参数按钮
                if (i < body.length - 1) {
                    document.getElementById('add2').click()
                }
            }
        }
    }



    log_refersh();

    function log_refersh() {
        //清空
        div = document.getElementById('home_log_plan');
        div.innerHTML = '';
        // 生成新的
        $.get('/get_home_log/',{
        },function (ret) { //ret 应该就是我们获取到的记录列表数组 的字符串形式
            // 这里写生成展示的代码
            console.log("测试");
            var res = eval(ret);
            var all_logs = res.all_logs;
            for(var i=0; i<all_logs.length;i++){
                var a =document.createElement('a') ;//创建a标签
                a.href="/home_log/"+all_logs[i].id+"/" ; // 点击函数
                a.style="text-decoration: none" ;
                a.class = 'log';
                var s = document.createElement('span'); //声明显示请求体类型的span
                s.style = "font-size: large;color: black";
                s.innerText = all_logs[i].api_method+' - '; //设定这个method;
                var s2 = document.createElement('span'); // 声明存放host+url的span
                s2.innerText = all_logs[i].api_host+all_logs[i].api_url;
                a.appendChild(s);
                a.appendChild(s2);
                div.appendChild(a);
                div.appendChild(document.createElement('br'));
            }
        })
    }

    {#发送请求#}


function ts_send() {
            // 获取接口的所有数据
            var ts_method = document.getElementById('ts_method').value ;
            var ts_url = document.getElementById('ts_url').value ;
            var ts_host = document.getElementById('ts_host').value ;
            var ts_header = document.getElementById('ts_header').value ;
             // 判断顶部的数据是否填充完
            if(ts_method == 'none'){alert('请选择请求方式！');return}
            if(ts_url == ''){alert('请输入url！');return}
            if(ts_host == ''){alert('请输入host！');return}
             //判断关键数据是否符合规则
            if(ts_host.slice(0,7) != 'http://' && ts_host.slice(0,8) != 'https://'){
                alert('host必须以http://或https://开头！');return
            }
            if(ts_header != ''){
                try {
                    JSON.parse(ts_header)
                }catch (e) {
                    alert('header请求头不符合json规范！');
                    return
                }
            }
            var ts_body_method = $('ul#myTab li[class="active"]')[0].innerText;
            if(ts_body_method == 'none'){
                var ts_api_body = ''
            }
            if(ts_body_method == 'form-data'){
                var ts_api_body = []; //新建这个空列表用来存放后续的数据
                var tbody_ = $("table#mytable tbody")[0]; //获取该表格的内容部分
                var trlist = tbody_.children ; //获取下面所有tr，每个tr就是一个键值对实际上
                for(var i=0;i<trlist.length;i++) {
                    var tdarr = trlist[i].children; // 获取tr下的俩个td
                    var key = tdarr[0].innerText; // 获取key
                    var value = tdarr[1].innerText; // 获取value
                    ts_api_body.push([key, value]);// 作为一个数组，存放到这个大数组里。
                }
                ts_api_body = JSON.stringify(ts_api_body);
            }
            if(ts_body_method == 'x-www-form-urlencoded'){
                var ts_api_body = []; //新建这个空列表用来存放后续的数据
                var tbody_ = $("table#mytable2 tbody")[0]; //获取该表格的内容部分
                var trlist = tbody_.children ; //获取下面所有tr，每个tr就是一个键值对实际上
                for(var i=0;i<trlist.length;i++) {
                    var tdarr = trlist[i].children; // 获取tr下的俩个td
                    var key = tdarr[0].innerText; // 获取key
                    var value = tdarr[1].innerText; // 获取value
                    ts_api_body.push([key, value]);// 作为一个数组，存放到这个大数组里。
                }
                ts_api_body = JSON.stringify(ts_api_body);
            }
            if(ts_body_method == 'Text'){
                var ts_api_body = document.getElementById('raw_Text').value;
            }
            if(ts_body_method == 'JavaScript'){
                var ts_api_body = document.getElementById('raw_JavaScript').value;
            }
            if(ts_body_method == 'Json'){
                var ts_api_body = document.getElementById('raw_Json').value;
            }
            if(ts_body_method == 'Html'){
                var ts_api_body = document.getElementById('raw_Html').value;
            }
            if(ts_body_method == 'Xml'){
                var ts_api_body = document.getElementById('raw_Xml').value;
            }
            // 发送请求给后台
             $.get('/Api_send_home/',{
                'ts_method':ts_method,
                'ts_url':ts_url,
                'ts_host':ts_host,
                'ts_header':ts_header,
                'ts_body_method':ts_body_method,
                'ts_api_body':ts_api_body
            },function (ret) {
                log_refersh();
                $("li a[href=#response]").click(); //点击一下返回体按钮
                document.getElementById('ts_response_body').value = ret ;//把返回值显示到返回值多行文本框中
            })
        }

    function home_log_show(id) {
        $.get("/get_api_log_home/", {
            "id": id
        }, function (ret) {
            console.log(ret);

        })
    }






</script>

{# 数量显示区域#}
{#<div style="background-color: #eefaff;min-height: 100px;width:-webkit-calc(100% - 340px);#}
{#            margin-left: 342px;position: fixed;bottom: 0px;box-shadow: -4px -4px 8px #e3e3e3;padding: 10px">#}
{#    <div style="width: 120px;height: 80px;background-color: #105f72;border-radius: 5px;color: black;padding: 3px;font-size: small">#}
{#        当前项目数: <span>{{ count_project }}</span> <br>#}
{#        当前接口数: <span>{{ count_api }}</span> <br>#}
{#        当前用例数: <span>{{ count_case }}</span> <br>#}
{#        当前报告数: <span>{{ count_report }}</span>#}
{#    </div>#}
{##}
    {#饼图#}
{#    <div style="position:fixed;bottom: 3px;left: 500px">#}
{#        <div class="circlechart" data-percentage="{{ ziyuan }}"></div>#}
{#        <div class="circlechart" data-percentage="30">30%</div>#}
{#        <div class="circlechart" data-percentage="85">85%</div>#}
{#        <span style="position: fixed;bottom: 5px;left: 530px;font-size: xx-small;color: #105f72;">资源比</span>#}
{#        <span style="position: fixed;bottom: 5px;left: 630px;font-size: xx-small;color: #105f72;">待定</span>#}
{#        <span style="position: fixed;bottom: 5px;left: 715px;font-size: xx-small;color: #105f72;">待定</span>#}
{#    </div>#}
{#</div>#}
{##}
{##}
{#<script src="{% static 'bingxingtu/js/progresscircle.js' %}"></script>#}
{#<script>#}
{#		$('.circlechart').circlechart(); // Initialization#}
{##}
{##}
{#</script>#}

{#<div style="text-align: center">#}
{##}
{#    <h1 style="color: white">#}
{#        <br>#}
{#        欢迎 {{ username }}  使用测试平台</h1>#}
{#    <br>#}
{#    <h2 style="color: white">welcome to ApiTest platform</h2>#}
{#    <img src="{% static '11.jpg' %}" alt="抱歉，图片走丢了 5555" width="200px">#}
{#    <br>#}
{#    <br>#}
{#    <textarea name="" id="tucao_input" cols="50" rows="10"></textarea>#}
{#    <br>#}
{#    <button onclick="tucao()" class="btn btn-success">提交</button>#}
{#    #}
{##}
{#</div>#}
{#吐槽的script#}
{#<script>#}
{#    function tucao() {#}
{#        $.get("/pei/",#}
{#            {"tucao_text":document.getElementById('tucao_input').value},#}
{#            function (ret) {#}
{#                alert('吐槽成功')#}
{#            }#}
{##}
{##}
{#        )#}
{##}
{#    }#}
{#</script>#}


</body>
</html>